#{extends 'main.html' /}
<div class="page-group">
    <div class="page page-current" id="payment-detail">
        <header class="bar bar-nav">
            <a href="javascript:history.go(-1);" class="icon icon-left pull-left"></a>
            <h1 class="title">缴费记录详情</h1>
        </header>
        <section class="payDetail content scroll_y">
            <div class="card0 m6">
                <div class="card-header">
                    <ul class="pull-left">
                        <li><span>单号：</span>
                            <p>${bill?.code}</p></li>
                        <li><span>账单开始日期：</span>
                            <p>${bill?.beginDay}</p></li>
                        <li><span>账单结束日期：</span>
                            <p>${bill?.endDay}</p></li>
                    </ul>
                    <ul class="pull-right">
                        <li><em><span class="st-payment-status">&{'paymentStatus.' + bill?.paymentStatus}</span></em></li>
                    </ul>
                </div>
                <div class="card-content">
                    <ul>
                    #{list billDetails , as :'detail'}
                        <li>
                            <em>¥${detail?.amount}</em>
                            <h3><span class="st-fee-type">&{'feeType.' + detail?.feeType}</span></h3>
                        </li>
                    #{/list}
                    </ul>
                </div>
                <div class="card-footer">
                    <div class="count"><p>费用合计：<i>¥${bill?.amount}</i></p></div>
                    <div class="pull-right">
                        <!--<a href="#" class="button button-link button-fill button-orange pull-right">去缴费</a>-->
                    </div>
                    #{if bill?.paymentStatus.toString() == 'NOT_PAID' || bill?.paymentStatus.toString() == 'FAILURE' }
                        <div class="tips">
                            <p>预计扣费时间${nextMonth}，请确保银行卡尾号${bankCardNo}余额充足。</p>
                        </div>
                    #{/if}
                </div>
                <div class="content-block">
                #{if bill?.paymentStatus.toString() == 'NOT_PAID' || bill?.paymentStatus.toString() == 'FAILURE'}
                    <input type="button" name="button" class="button button-fill button-big button-orange" id="goToPay" value="立即支付">
                #{/if}
                #{else }
                    <input type="button" name="button" class="button button-fill button-big button-orange" id="button" value="已经支付">
                #{/else}
                </div>
            </div>
            <script type="text/javascript">
                $('#goToPay').on('click',function () {
                    window.location.href="http://www.yoolink.com.cn/WebPay/pay/initOrderPageAmount?qrcodeSeq=1000001355&amount=10.01";
                })

            </script>
        </section>

    #{include 'weixin/footer.html'/}

    </div>
</div>

